/* Scints page basic css */
DIV {
	font-family:Arial, Helvetica, sans-serif;
	font-size:13px;
}

#csmbol-header	{
	background: #FFF/*#F9F9F98*/;
	border-bottom: 1px solid #DDD;
	height: 60px;
	width: 745px;
}
#csmbol-header DIV {
	margin: 0 auto;
}
#csmbol-header .button	{
	margin: 50px 0 0;
}
#csmbol-header H1	{
/*		background: url(graphics/mootools.png) no-repeat 0 50%;
*/		
	height: 46px;
	margin: 0 auto;
	padding: 38px 0;
/*		text-indent: -9999px;
*/	}

#csmbol-wrapper {
/*	background: url(graphics/gradient.png) repeat-x;
*/
}

#csmbol-content {	
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	width: 745px;
}

#csmbol-leftcolumn {
	border-right: 1px solid #DDD;
	float: left;
	font-size: 1.1em;
	margin: 25px 5px 0 0;
	padding: 0 5px 5px 0;
	width: 0%;/* no left nav*/
}

#csmbol-content #csmbol-leftcolumn LI	{
	padding: 1px 0;
	text-align: right;
}
#csmbol-content #csmbol-leftcolumn H4 {
	text-align: left;
	border-bottom: 1px solid #ddd;
	font-size: 1.2em;
	color: #313334;
	line-height: 20px;
}
#csmbol-content #csmbol-leftcolumn A {
	display: block;
}

#csmbol-rightcolumn	{
	float: left;
	margin: 25px 0 0;
	overflow: hidden;
	width: 100%;
}
	
#csmbol-wrapper-inner {
/*	background: url(graphics/gradient.png) repeat-x;

background: #F9F9F9;*/
}	

#csmbol-content-inner {
	margin: 0 auto;
	padding: 0 0 10px;
	width: 750px;
}
	#csmbol-leftcolumn-inner {
		border-right: 1px solid #DDD;
		float: left;
		font-size: 1.1em;
		margin: 10px 3px 0 0;
		padding: 0 3px 30px 0;
		width: 620px;
	}	
	#csmbol-opt-leftcolumn-inner {
		border-right: 1px solid #DDD;
		float: left;
		font-size: 1.1em;
		margin: 10px 3px 0 0;
		padding: 0 3px 50px 0;
		width: 615px;
	}	
	#csmbol-booking-leftcolumn-inner{
		border-right: 1px solid #DDD;
		float: left;
		font-size: 1.1em;
		margin: 10px 3px 0 0;
		padding: 0 3px 50px 0;
		width: 605px;
	}
	#csmbol-booking-summary-leftcolumn-inner, #csmbol-booking-completed-leftcolumn-inner {
		border-right: 1px solid #DDD;
		float: left;
		font-size: 1.1em;
		margin: 10px 3px 0 0;
		padding: 0 3px 50px 0;
		width: 580px;
	}		
	#csmbol-leftcolumn-container {
		width: 640px;
	}		
	
	.csmbol-datetimebox{
		background: #F9F9F9;
		border: 1px solid #DDD;
		float: left;
		font-size: 1em;
		margin: 3px 3px 0 0;
		padding: 3px 3px 3px 10px;
		width: 97%;
	}	
		
	#csmbol-datetimebox-loading{
		background-color:#F9F9F9;
		border: 1px solid #DDD;
		float: left;
		font-size: 1em;
		margin: 3px 3px 0 0;
		padding: 3px 3px 3px 10px;
		width: 97%;
	}	
	.csmbol-datetimebox-running-number{
		margin-top: 3px; margin-left: 10%; margin-right:10%; width:80%; font-weight:bold; text-align:center;
	}	
	
	#csmbol-datebox-loading{
		float:left;
		margin: 3px 3px 0 0;
		padding: 0 0 3px 0;				
		width: 120px;
		border-right: 1px solid #DDD;
	}
						
	.csmbol-date{
		float:left;
		margin: 3px 3px 0 0;
		padding: 0 0 3px 0;				
		width: 120px;
		border-right: 1px solid #DDD;
	}
	.csmbol-sel-room{
		float:left;
		margin: 3px 3px 0 0;
		padding: 0 0 3px 0;				
		width: 110px;
		border-right: 1px solid #DDD;
	}	
	.csmbol-date-caption{
		float:left; margin-top:3px; width:80px; overflow:visible; font-weight:bold
	}
				
	.csmbol-timebox{
		float:left;
		margin: 3px 0 0 0;
		padding: 0 3px 3px 3px;
		width:360px;								
	}

	.csmbol-time-caption{
		float:left; margin-top:3px; width:80px; overflow:visible; font-weight:bold
	}			
	
	#csmbol-time-singleslot{
		float:left;
		margin: 3px 0 0 3px;					
		padding: 0 3px 3px 0;					
		width: 150px;
		border-right: 1px solid #DDD;		
	}

	#csmbol-time-singleslot-caption{
		float:left;
		margin: 3px 3px 0 3px;					
		padding: 0 5px 3px 0;					
		width: 50px;
		overflow: visible;
	}						
	
	#csmbol-time-fullday{
		float:left;
		margin: 3px 0 0 0;		
		padding: 0 3px 3px 6px;									
		width:100px;
	}

	#csmbol-time-fullday-caption{
		float:left;
		margin: 3px 3px 0 0;		
		padding: 0 3px 3px 0;									
		width: 110px;
		overflow:visible;
	}	

	#csmbol-service-module{
		float:right;
		margin: 3px 0 0 0;		
		padding: 0 3px 3px 6px;									
		overflow:visible;
		width:25px;
		height:60px;	
		border-left: 1px solid #DDD;				
	}					
				
	#csmbol-content-inner #csmbol-leftcolumn-inner LI	{
		padding: 1px 0;
		text-align: right;
	}
	#csmbol-content-inner #csmbol-leftcolumn-inner H4 {
		text-align: left;
		border-bottom: 1px solid #ddd;
		font-size: 1.2em;
		color: #313334;
		line-height: 20px;
	}
	#csmbol-content-inner #csmbol-leftcolumn-inner A {
		display: block;
	}
	#csmbol-rightcolumn-inner	{
		float: left;
		margin: 25px 0 0;
		overflow: hidden;
		width: 115px;
	}
	#csmbol-opt-rightcolumn-inner	{
		float: left;
		margin: 25px 0 0;
		overflow: hidden;
		width: 120px;
	}
	#csmbol-booking-rightcolumn-inner	{
		float: left;
		margin: 25px 0 0;
		overflow: hidden;
		width: 130px;
	}
	#csmbol-booking-summary-rightcolumn-inner {
		float: left;
		margin: 25px 0 0;
		overflow: hidden;
		width: 140px;
	}
	#csmbol-booking-completed-rightcolumn-inner {
		float: left;
		margin: 25px 0 0;
		overflow: hidden;
		width: 150px;
	}	
	#csmbol-datetimebox-container {
		float: left;
		width: 100%;		
	}				
	#csmbol-option-box {
		background: #FFF/*#F9F9F98*/;
		border: 1px solid #DDD;
		float: left;
		font-size: 1em;
		margin: 3px 3px 0 0;
		padding: 3px 3px 10px 10px;
		width: 97%;		
	}
	#csmbol-booking-box {
		background: #FFF/*#F9F9F98*/;
		border: 1px solid #DDD;
		float: left;
		font-size: 1em;
		margin: 3px 3px 0 0;
		padding: 3px 3px 10px 10px;
		width: 97%;		
	}
	.csmbol-booking-entry, #csmbol-booking-entry-loading, .csmbol-info-box {
		background: #F9F9F9;
		border: 1px solid #DDD;
		float: left;
		font-size: 1em;
		margin: 3px 3px 0 0;
		padding: 10px 3px 10px 10px;
		width: 97%;		
	}		
	#csmbol-booking-summary-box {
		background: #F9F9F9;
		border: 1px solid #DDD;
		float: left;
		font-size: 1em;
		margin: 3px 3px 0 0;
		padding: 3px 3px 10px 5px;
		width: 98%;		
	}		
	.csmbol-booking-data-row-booking-entry, .csmbol-booking-data-row {
		margin: 2px 0px 0 0;
		padding: 2px 3px 3px 5px;
		width: 98%;
		display:block;
	}			
	.csmbol-option-container{
	}
	.csmbol-datetime-row-item {
		font-size: 12.5px;	
	}	
	.csmbol-option-item {
		font-size: 11.5px;	
	}
	.csmbol-item-date {
		margin: 2px 0px 0 0;
		padding: 2px 3px 3px 5px;
		width: 69px;
		display:block;
		overflow:visible;
		float:left;		
		border-bottom: 1px dashed #AAA;				
		height: 19px;
	}	
	.csmbol-item-name {
		margin: 2px 0px 0 0;
		padding: 2px 2px 3px 5px;
		display:block;
		overflow:visible;
		border-bottom: 1px dashed #AAA;
		float:left;
		width:285px;
		height: 19px;		
	}
	.csmbol-item-rate {
		margin: 2px 0px 0 0;
		padding: 2px 0px 3px 0px;
		width: 59px;
		display:block;
		float:left;			
		border-bottom: 1px dashed #AAA;			
		height: 19px;			
	}
	.csmbol-item-qty {
		margin: 2px 0px 0 0;
		padding: 2px 2px 3px 0px;
		width: 20px;
		display:block;
		float:left;			
		border-bottom: 1px dashed #AAA;
		text-align:left;
		height: 19px;		
	}
	.csmbol-item-amt {
		margin: 2px 0px 0 0;
		padding: 2px 0px 3px 5px;
		width: 82px;
		display:block;
		float:left;			
		border-bottom: 1px dashed #AAA;		
		height: 19px;				
	}
	.csmbol-item-separator {
		width:auto;
		display:block;
		float:left;
		height: 19px;		
	}				
	
	.csmbol-option {
		margin: 2px 3px 0 0;
		padding: 2px 2px 3px 5px;
		width: 96%;
		display:block;
		border-bottom: 1px dashed #AAA;
/*		float:left;*/
	}

	.csmbol-option-title {
		background:#DDD;		
		margin: 8px 3px 5px 0;
		padding: 3px 2px 3px 5px;
		width: 97%;
		display:block;
		font-weight:bold;
		float:left;
	}
	.csmbol-bs-booked{
		background:#C66;
		padding:0 2px 0 0;
	}
	.csmbol-bs-cp{
		background:#FC3;
		padding:0 2px 0 0;		
	}
	.csmbol-bs-avail{
		background:#D0EAD0;
		padding:0 2px 0 0;		
	}
	.csmbol-bs-indicator-box{
		font-weight:bold;
		width:80px; 
		padding:2px; 
		margin: 5px;
		float:left;
		text-align:center;
	}				
/* Scints tab css */
.csmbol-tabs	{
	border-bottom: 1px solid #DDD;
	height: 33px;
}
	.csmbol-tabs LI	{
		cursor: pointer;
		float: left;
		font: bold 1em/18px Helvetica, Arial, sans-serif;
		margin: 0 0 0 5px;
		text-align: center;
	}
	.csmbol-tabs LI.csmbol-tab	{
		background: #FFF/*#F4F5F5*/;
		border: 1px solid #CCC;
		border-bottom: none;
		color: #777;
		filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#FDFDFD', EndColorStr='#F4F5F5');
		padding: 8px 0 0;
		height: 24px;
		width: 130px;
		-moz-border-radius-topleft: 6px;
		-moz-border-radius-topright: 6px;
		border-top-left-radius: 6px;
		border-top-right-radius: 6px;
		list-style-type: none;
	}

	.csmbol-tabs LI.selected	{
		color: #B86364;
		height: 25px;
	}
	.csmbol-tabs LI.disabled	{
		color: #CCCCCC;
		height: 25px;
		cursor:default;
	}	
.csmbol-tabs:AFTER	{
	clear: both;
	content: ".";
	display: block;
	height: 0;
	visibility: hidden;
}

.csmbol-tabcontent	{
	background: #FFF/*#F4F5F5*/;
	display: none;
	padding: 5px 0;
	float:left;
}
	.csmbol-tabcontent IFRAME	{
		min-height: 500px;
		width: 100%;
	}
.csmbol-tabcontent.selected	{
	display: block;
}

/* styles for the date picker*/
/* the div that holds the date picker calendar */
.dpDiv {
    }


/* the table (within the div) that holds the date picker calendar */
.dpTable {
    font-family: Tahoma, Arial, Helvetica, sans-serif;
    font-size: 12px;
    text-align: center;
    color: #505050;
    background-color: #ece9d8;
    border: 1px solid #AAAAAA;
    }


/* a table row that holds date numbers (either blank or 1-31) */
.dpTR {
    }


/* the top table row that holds the month, year, and forward/backward buttons */
.dpTitleTR {
    }


/* the second table row, that holds the names of days of the week (Mo, Tu, We, etc.) */
.dpDayTR {
    }


/* the bottom table row, that has the "This Month" and "Close" buttons */
.dpTodayButtonTR {
    }


/* a table cell that holds a date number (either blank or 1-31) */
.dpTD {
    border: 1px solid #ece9d8;
    }


/* a table cell that holds a highlighted day (usually either today's date or the current date field value) */
.dpDayHighlightTD {
    background-color: #CCCCCC;
    border: 1px solid #AAAAAA;
    }


/* the date number table cell that the mouse pointer is currently over (you can use contrasting colors to make it apparent which cell is being hovered over) */
.dpTDHover {
    background-color: #aca998;
    border: 1px solid #888888;
    cursor: pointer;
    color: red;
    }


/* the table cell that holds the name of the month and the year */
.dpTitleTD {
    }


/* a table cell that holds one of the forward/backward buttons */
.dpButtonTD {
    }


/* the table cell that holds the "This Month" or "Close" button at the bottom */
.dpTodayButtonTD {
    }


/* a table cell that holds the names of days of the week (Mo, Tu, We, etc.) */
.dpDayTD {
    background-color: #CCCCCC;
    border: 1px solid #AAAAAA;
    color: white;
    }


/* additional style information for the text that indicates the month and year */
.dpTitleText {
    font-size: 12px;
    color: gray;
    font-weight: bold;
    }


/* additional style information for the cell that holds a highlighted day (usually either today's date or the current date field value) */ 
.dpDayHighlight {
    color: 4060ff;
    font-weight: bold;
    }


/* the forward/backward buttons at the top */
.dpButton {
    font-family: Verdana, Tahoma, Arial, Helvetica, sans-serif;
    font-size: 10px;
    color: gray;
    background: #d8e8ff;
    font-weight: bold;
    padding: 0px;
    }


/* the "This Month" and "Close" buttons at the bottom */
.dpTodayButton {
    font-family: Verdana, Tahoma, Arial, Helvetica, sans-serif;
    font-size: 10px;
    color: gray;
    background: #d8e8ff;
    font-weight: bold;
    }

#csmbol-booking-entry-loading, #csmbol-datetimebox-loading, #csmbol-timebox-loading, div.ajax-loading {
	padding: 20px 3px 20px 10px;
	background: url(spinner.gif) no-repeat 40% 50%;
}
.loading-text{
	position:relative;
	left:45%;
}
.tnc-box{
	background:#f9f9f9;
	border: solid 1px #ddd;
	margin:5px;
	padding:15px;
	text-align:justify;
}
.tnc-suboptin-box{
	margin:auto; 
	padding:15px; 
	width:300px; 
	text-align:center;
}
.tnc-suboptin-table{
	width:250px;
	float:left;
	border:1px solid #DDD;
	padding:3px; 
	text-align:left;
}
.disabled-img-btn{
	opacity:0.5;
}
.csmbol-btn{
	border:1px solid #000;
	background: #DAEADA;
	margin-bottom:15px;
}
input.disabled{
	border:1px solid #ddd;
	background: #DAEEDA;
	margin-bottom:15px;
}
.csmbol-msg-error{
	color:#C30;
	font-weight:bold;
}
.csmbol-msg-ready{
	background:#AFA;
	font-weight:bold;	
}
.csmbol-msg-success{
	color:#063;
	font-weight:bold;
}
.csmbol-inp{
	border:1px solid #999;
	background: #fff;
	padding:0;
	margin:0;
}
input.ro{
	border:1px solid #999;
	background: #ddd;
	padding:0;
}
div.samerowdiv{
	float:left;
}
.csmbol-csbox{
	float:left;
	width:90%;
	padding:3px;
	border:1px solid #DDD;
	margin:0 0 10px 0;
}

#imp_box      { border:1px solid #ccc; width:200px; height:20px; }
#imp_perc      { background:#ccc; height:20px; }
#imp_disp      { font-family:tahoma, arial, sans-serif; font-size:11px; color:#000; float:left; padding:3px 0 0 10px; }

#csmbol-accordion  {
  margin: 20px 0 0;
  max-width: 400px;
}
  #csmbol-accordion H2 {
    background: #6B7B95;
    color: white;
    cursor: pointer;
    font: 12px Helvetica, Arial, sans-serif;
    line-height: 16px;
    margin: 0 0 4px 0;
    padding: 3px 5px 1px;
  }
  #csmbol-accordion .content {
    background-color: #F4F5F5;
  }
  #csmbol-accordion .content p {
    margin: 0.5em 0;
    padding: 0 6px 8px 6px;
  }